
<template>
  <div id="APP">
    <router-view v-slot="props">
      <keep-alive include="home">
        <component :is="props.Component"></component>
      </keep-alive>
    </router-view>
    <!-- 这是显示隐藏tabbar的第一种方案，要在路由配置meta;第二种方案是通过样式的层级以及position来控制 -->
    <!-- 第二种方案的样式写在了common.css共用样式那里，只要添加了类名，就可以使用 -->
    <Tabbar v-if="!route.meta.hideTabBar" />
    <!-- <Tabbar /> -->
    <Loading />
  </div>
</template>
<script setup>
import { useRoute } from 'vue-router'
import Tabbar from "@/components/tab-bar/tab-bar.vue";
import Loading from "@/components/loading/loading.vue"
const route = useRoute()
</script>

<style scoped></style>
